<template>
	<view class="terz-res-box">
		<image class="terz-res-icon" src="/static/terz_result_icon.png" mode="aspectFit"></image>
		<text class="terz-res-title">提额成功</text>
		<view class="terz-res-info">
			<view class="terz-res-info-item">
				<text>姓名</text>
				<text>{{props.certName}}</text>
			</view>
			<view class="terz-res-info-item">
				<text>身份证号</text>
				<text>{{idCard}}</text>
			</view>
			<view class="terz-res-info-item">
				<text>银行卡号</text>
				<text>{{bankCardNo}}</text>
			</view>
		</view>
	</view>
</template>

<script setup>
	import { computed } from 'vue'
	const props = defineProps()
	//格式化后的银行卡号
	const bankCardNo = computed(()=>{
		return uni.$tools.formatBankCardNo(props.cardNo)
	})
	//格式化后的身份证号
	const idCard = computed(()=>{
		return uni.$tools.formatIdCard(props.certNo)
	})
</script>

<style lang="scss" scoped>
.terz-res-box{
	display: flex;
	flex-direction: column;
	color: $xh-title-color;
	.terz-res-icon{
		width: 220rpx;
		height: 220rpx;
		margin: 100rpx auto 0;
	}
	.terz-res-title{
		font-size: 40rpx;
		margin: 60rpx auto 0;
	}
	.terz-res-info{
		margin-top: 200rpx;
		margin-left: 100rpx;
		font-size: 30rpx;
		.terz-res-info-item{
			display: flex;
			align-items: center;
			margin-bottom: 60rpx;
			text:nth-of-type(1){
				min-width: 200rpx;
			}
		}
	}
}
</style>
